<template>
  <div>
    <MBX Biao="权限管理" Biao1="权限列表"></MBX>

    <el-card class="mt">
      <!-- 表格 -->
      <el-table :data='qList'  border style="width: 100%">
        <el-table-column type='index' prop="date" label="#" width="180"> </el-table-column>
        <el-table-column prop="authName" label="权限名称" width="180"> </el-table-column>
        <el-table-column prop="path" label="路径"> </el-table-column>
        <el-table-column prop="level" label="权限等级">
            <template slot-scope='scope'>
                <div>
                    <el-tag :type='typeColor[scope.row.level]'>{{scope.row.level|qx}}</el-tag>
                </div>
            </template>
        </el-table-column>
      </el-table>
    </el-card>
  </div>
</template>

<script>
import {getQx} from '@/http/api'
export default {
    data(){
        return{
            qList:[],//权限列表数组
            typeColor:{
                0:'primary',
                1:'success',
                2:"warning"
            }

        }
    },
    created(){
       this.getQuznXian()
    },
    methods:{
      //获取权限列表的方法
      async getQuznXian(){
          //调用接口
          const res=await getQx()
           console.log('权限列表接口',res);
           this.qList=res
      } 
    }
};
</script>

<style scoped></style>
